react 箭头函数和普通函数
我忍不住想知道对于 React 功能组件使用普通函数和粗箭头之间是否有任何优势
const MyMainComponent = () => (
<main>
<h1>Welcome to my app</h1>
</main>
)
function MyMainComponent() {
return (
<main>
<h1>Welcome to my app</h1>
</main>
)
}
当然，两者都工作得很好，但是有推荐的方法来编写它们吗？有支持其中之一的论据吗？
编辑：我知道普通 javascript 函数（即上下文、堆栈跟踪、返回关键字等）的差异可能会对函数的使用类型产生影响。然而我纯粹是根据 React 组件来问这个问题的。
主要是偏好问题。然而，存在一些（微小的、几乎微不足道的）差异：
return如果您直接返回 JSX，而不需要任何先前的表达式，则粗箭头语法允许您省略花括号和关键字。使用 ES5 函数，您必须拥有{ return ... }.- 粗箭头语法不会创建 的新上下文
this，而 ES5 函数会创建新的上下文。this当您想要在函数内部引用 React 组件或想要跳过该this.foo = this.foo.bind(this);步骤时，这可能很有用。
它们之间有更多差异，但在 React 中编码时它们很少是相对的（例如使用arguments、new等）。
就个人而言，我尽可能使用粗箭头语法，因为我更喜欢这种语法。